<template>
	<view>
		<view class="main">
			<u-sticky>
				<view class="search">
					<view class="search-input">
						<u-search placeholder="终端号" shape="square" bgColor="#ffffff" :showAction="false"
							v-model="keyword" @search="search"></u-search>
					</view>
				</view>
			</u-sticky>
			<view class="" v-if="type == 1">
				<view class="list_box" v-if="mydata !== undefined && mydata!== null && mydata.length>0">
					<view class="list" v-for="(item,index) in mydata" :key="index" @click="order(index)">
						<view class="avatar">
							<u-avatar :src="src" size="48"></u-avatar>
						</view>
						<view class="info">
							<view class="ups">
								<text class="oneName">{{item.name}}</text>
							</view>
							<view class="">
								<text>{{item.phone}}</text>
							</view>
						</view>
					</view>
				</view>
				<u-empty v-else mode="list" icon="/static/Empty/data_null.png">
				</u-empty>
			</view>
			<view class="" v-if="type == 2">
				<view class="list_box" v-if="policy !== undefined && policy!== null && policy.length>0">
					<view class="list" v-for="(item,index) in policy" :key="index" @click="order(index)">
						<text>{{item.title}}</text>
					</view>
				</view>
				<u-empty v-else mode="list" icon="/static/Empty/data_null.png">
				</u-empty>
			</view>
			<view class="" v-if="type == 3">
				<view class="list_box" v-if="ProductList !== undefined && ProductList!== null && ProductList.length>0">
					<view class="list" v-for="(item,index) in ProductList" :key="index" @click="order(index)">
						<text>{{item.name}}</text>
					</view>
				</view>
				<u-empty v-else mode="list" icon="/static/Empty/data_null.png"></u-empty>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				keyword: '',
				mydata: [],
				policy: [],
				ProductList: [],
				type: null,
				page: 1,
				bottom: true,
				src: '/static/default.jpg'
			}
		},
		onLoad(e) {
			this.type = e.type
			if (this.type == 1) {
				this._list()
			} else if (this.type == 2) {
				this._policy()
			} else {
				this._ProductList()
			}
		},
		//下拉刷新
		onReachBottom() {
			// if (this.bottom == true) {
			// 	this.page += 1
			// 	this._policy()
			// }
		},
		methods: {
			// 搜索
			search() {
				this._list()
			},
			// 人员列表
			async _list() {
				uni.showLoading({
					title: '加载中'
				});
				const {
					data: res
				} = await this.$myHttp({
					url: 'setting/getChild',
					data: {
						keyword: this.keyword
					},
				});
				uni.hideLoading()
				if (res.code == 200) {
					this.mydata = res.data
				}
			},
			// 政策列表
			async _policy() {
				uni.showLoading({
					title: '加载中'
				});
				const userinfo = uni.getStorageSync('userinfo');
				const {
					data: res
				} = await this.$myHttp({
					url: 'setting/getPolicyList',
					data: {
						page: this.page,
						page_size: 15
					},
					header: {
						'token': userinfo.token
					},
				});
				if (res.code == 1) {
					if (res.data.data !== undefined && res.data.data !== null && res.data.data.length >
						0) {
						if (this.page == 1) {
							this.policy = res.data.data
							uni.hideLoading()
						} else {
							this.policy = [...this.policy, ...res.data.data]
							uni.hideLoading()
						}
					} else {
						uni.hideLoading()
						this.bottom = false
					}
				} else {
					uni.showToast({
						title: res.msg,
						duration: 1000,
						icon: "none"
					});
					this.bottom = false
				}
			},
			// 政策列表
			async _ProductList() {
				uni.showLoading({
					title: '加载中'
				});
				const userinfo = uni.getStorageSync('userinfo');
				const {
					data: res
				} = await this.$myHttp({
					url: 'setting/getEquipProductList',
					data: {},
					header: {
						'token': userinfo.token
					},
				});
				if (res.code == 200) {
					this.ProductList = res.data
					uni.hideLoading()
				} else {
					uni.showToast({
						title: res.msg,
						duration: 1000,
						icon: "none"
					});
					this.bottom = false
				}
			},
			order(index) {
				if (this.type == 1) {
					uni.$emit('updateData', this.mydata[index])
					uni.navigateBack({
						delta: 1
					})
				} else if (this.type == 2) {
					console.log(index)
					uni.$emit('updatepolicy', this.policy[index])
					uni.navigateBack({
						delta: 1
					})
				} else {
					uni.$emit('updateProduct', this.ProductList[index])
					uni.navigateBack({
						delta: 1
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F2F6FC;
	}

	.main {
		padding: 0 30rpx 30rpx 30rpx;

		.search {
			padding: 30rpx 0;
			background-color: #F2F6FC;
		}

		.list_box {
			box-sizing: border-box;
			background-color: #fff;
			border-radius: 18rpx;
			box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);

			.list {
				display: flex;
				padding: 20rpx 30rpx;
				box-sizing: border-box;
				border-bottom: 1px solid #f4f4f5;

				.avatar {
					padding-right: 30rpx;
				}

				.info {
					display: flex;
					flex-direction: column;

					.ups {
						.oneName {
							padding-bottom: 10rpx;
						}

						.blues {
							font-size: 24rpx;
							border-radius: 10rpx;
							background-color: #2979ff;
							color: #ffffff;
							padding: 4rpx 8rpx;
							margin-left: 20rpx;
						}

						.reds {
							font-size: 24rpx;
							border-radius: 10rpx;
							background-color: #fa3534;
							color: #ffffff;
							padding: 4rpx 8rpx;
							margin-left: 20rpx;
						}
					}

					text {
						font-size: 28rpx;
					}
				}
			}
		}
	}
</style>